<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../lib/jquery/jquery-1.11.1.js" ></script>
		<script type="text/javascript">
			function f1() {
//				$('div span').css('background-color','red');
//				$('div > span').css('background-color','blue');
//				$('div + span').css('background-color','red');
				$('div~span').css('background-color','green');
			}
		</script>
	</head>
	<body>
		 <h2>层次选择器</h2>
        <div>
            <span>张飞</span>
            <p>
                <span>赵云</span>
            </p>
            <span>关羽</span>
        </div>
        <p>lkls</p>
        <span>曹操</span>
        <p>吕布</p>
        <span>孙权</span>
        <div>小乔</div>
        <span>大乔</span>

        <input type="button" value="触发" onclick="f1()" />
	</body>
</html>
